{extend name="public/pure"}
{block name="style"}
    <title>点对点教育VIP学员_统计详情</title>
    <link rel="stylesheet" href="__HOME__/css/mui/mui.min.css">
    <link rel="stylesheet" href="__HOME__/css/user/detail.css">
<style>
    body{
        background: #fff;
    }
    .default {
        width: 100%;
        height: 100%;
        position:absolute;
    }
    .default img {
        width: 19vw;
        height: 29vw;
        margin-top: 10vh;
        margin-left: 40vw;
    }
    .sel{
        padding: 1vw 5vw;
        font-size: 1.6rem;
    }
    .sel span{
        margin-left: 20vw;
    }
    #openPopover2{
        display: inline-block;
        width: 40%;
        border-radius: 5px;
        padding:0.9vw 1vw;
        color: #8f8f94;
        background: #ffffff;
        text-align: center;
    }
    #openPopover2:after{
        display: inline-block;
        content: '';
        width: 0;
        height: 0;
        border-left: 0.4rem solid transparent;
        border-right: 0.4rem solid transparent;
        border-top: 0.6rem solid #949494;
        margin-left: 0.3rem;
        position: relative;
        top:0.7rem;
        float:right;
    }
    .mui-popover .mui-table-view{
        text-align: center;
    }
    #popover2 {
        height: 300px;
    }
    .bott{
        width:100%;
        text-align: center;
        height:4vw;
        position: relative;
        z-index:9999;
        display: none;
        margin-top:30vw;
        font-size:1.6rem;
    }
</style>
{/block}

{block name="body"}
    <div class="top">
        <div class="topName">未完成服务统计</div>
        <div class="depart">{$id|get_school}</div>
        <div class="departs"></div>
    </div>
<div class="sel">
    <span>年份筛选</span>
    <a id="openPopover2" href="#popover2" data-id=""></a>
</div>
    <div class="navbar">
        <ul class="classify">
            <li class="active">未签到</li>
            <li>未交总结</li>
            <li>未交测试</li>
            <li>未交作业</li>
        </ul>
        <div class="ranging">
            <p class="bott">&nbsp;加载中...</p>
            <!--//周榜-->
            <div class="weeklist" data-id="1">

            </div>
            <div class="monthlist" data-id="2" style="display:none">

            </div>
            <div class="sumlist" data-id="3" style="display:none">

            </div>
            <div class="sumlists" data-id="4" style="display:none">

            </div>
        </div>
    </div>
<div id="popover2" class="mui-popover" >
    <div class="mui-scroll-wrapper">
        <div class="mui-scroll">
            <ul class="mui-table-view">
                {volist name="years" id="a"}
                <li class="mui-table-view-cell" data-id="{$a}"><a>{$a}</a></li>
                {/volist}
            </ul>
        </div>
    </div>
</div>
{/block}

{block name="script"}
<script src="__HOME__/js/mui.min.js"></script>
<script>
    //关闭分享
    function onBridgeReady() {
        WeixinJSBridge.call('hideOptionMenu');
    }
    if (typeof WeixinJSBridge == "undefined") {
        if (document.addEventListener) {
            document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
        } else if (document.attachEvent) {
            document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
            document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
        }
    } else {
        onBridgeReady();
    }
    mui('.mui-scroll-wrapper').scroll();
    //切换
    $('.classify>li ').click(function(){
        if(!$(this).hasClass('active')){
            $(this).parent().find('.active').removeClass('active');
            $(this).addClass('active');
            $('.ranging>div').hide();
            $('[data-id='+($(this).index()+1)+']').show();
        }
    });
    var y = "{$y}";
    var id = "{$id}";
    $("#openPopover2").html(y);
    $("#openPopover2").attr("data-id",y);
    $(".departs").html('签到：0/0 总结：0/0 测试：0/0 作业：0/0');
    $.ajax({
        type:"post",
        url:"{:Url('User/details')}",
        data:{
            id:id,
            year:y
        },
        beforeSend: function(XMLHttpRequest){
            $(".bott").show();
        },
        success:function(data){
            $(".bott").hide();
            var da = data.data;
            var str = "签到："+da.sign.length+"/"+da.list+" 总结："+da.summary.length+"/"+da.list+" 测试："+da.test.length+"/"+da.list+" 作业："+da.homework.length+"/"+da.list;
            $(".departs").html(str);
            if (da.sign.length != 0){
                var html1 = '<ul>';
                for(var i = 0; i< da.sign.length;i++){
                    var list = da.sign[i];
                        html1+='<li>'+
                            '<img src="'+list.head+'" class="userImg">'+
                                '<p>'+list.name+'</p>'+
                                '<b>'+list.vip+'</b></li>'
                }
                html1+='</ul>';
                $(".weeklist" ).append(html1);
            }else{
                $(".weeklist" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
            }
            if (da.summary.length != 0){
                var html2 = '<ul>';
                for(var k = 0; k< da.summary.length;k++){
                    var lists = da.summary[k];
                    html2+='<li>'+
                            '<img src="'+lists.head+'" class="userImg">'+
                            '<p>'+lists.name+'</p>'+
                            '<b>'+lists.vip+'</b></li>'
                }
                html2+='</ul>';
                $(".monthlist" ).append(html2);
            }else{
                $(".monthlist" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
            }
            if (da.test.length != 0){
                var html3 = '<ul>';
                for(var x = 0; x< da.test.length;x++){
                    var listss = da.test[x];
                    html3+='<li>'+
                            '<img src="'+listss.head+'" class="userImg">'+
                            '<p>'+listss.name+'</p>'+
                            '<b>'+listss.vip+'</b></li>'
                }
                html3+='</ul>';
                $(".sumlist" ).append(html3);
            }else{
                $(".sumlist" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
            }
            if (da.homework.length != 0){
                var html4 = '<ul>';
                for(var y = 0; y< da.homework.length;y++){
                    var listsss = da.homework[y];
                    html4+='<li>'+
                            '<img src="'+listsss.head+'" class="userImg">'+
                            '<p>'+listsss.name+'</p>'+
                            '<b>'+listsss.vip+'</b></li>'
                }
                html4+='</ul>';
                $(".sumlists" ).append(html4);
            }else{
                $(".sumlists" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
            }
        }
    })
    $("#popover2 ul li").click(function(){
        var year = $(this).data("id");
        $("#openPopover2").html(year);
        $("#openPopover2").attr("data-id",year);
        $(".weeklist").empty();
        $(".monthlist").empty();
        $(".sumlist").empty();
        $(".sumlists").empty();
        $.ajax({
            type:"post",
            url:"{:Url('User/details')}",
            data:{
                id:id,
                year:year
            },
            beforeSend: function(XMLHttpRequest){
                $(".bott").show();
            },
            success:function(data){
                $(".bott").hide();
                var da = data.data;
                var str = "签到："+da.sign.length+"/"+da.list+" 总结："+da.summary.length+"/"+da.list+" 测试："+da.test.length+"/"+da.list+" 作业："+da.homework.length+"/"+da.list;
                $(".departs").html(str);
                if (da.sign.length != 0){
                    var html1 = '<ul>';
                    for(var i = 0; i< da.sign.length;i++){
                        var list = da.sign[i];
                        html1+='<li>'+
                                '<img src="'+list.head+'" class="userImg">'+
                                '<p>'+list.name+'</p>'+
                                '<b>'+list.vip+'</b></li>'
                    }
                    html1+='</ul>';
                    $(".weeklist" ).append(html1);
                }else{
                    $(".weeklist" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
                }
                if (da.summary.length != 0){
                    var html2 = '<ul>';
                    for(var k = 0; k< da.summary.length;k++){
                        var lists = da.summary[k];
                        html2+='<li>'+
                                '<img src="'+lists.head+'" class="userImg">'+
                                '<p>'+lists.name+'</p>'+
                                '<b>'+lists.vip+'</b></li>'
                    }
                    html2+='</ul>';
                    $(".monthlist" ).append(html2);
                }else{
                    $(".monthlist" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
                }
                if (da.test.length != 0){
                    var html3 = '<ul>';
                    for(var x = 0; x< da.test.length;x++){
                        var listss = da.test[x];
                        html3+='<li>'+
                                '<img src="'+listss.head+'" class="userImg">'+
                                '<p>'+listss.name+'</p>'+
                                '<b>'+listss.vip+'</b></li>'
                    }
                    html3+='</ul>';
                    $(".sumlist" ).append(html3);
                }else{
                    $(".sumlist" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
                }
                if (da.homework.length != 0){
                    var html4 = '<ul>';
                    for(var y = 0; y< da.homework.length;y++){
                        var listsss = da.homework[y];
                        html4+='<li>'+
                                '<img src="'+listsss.head+'" class="userImg">'+
                                '<p>'+listsss.name+'</p>'+
                                '<b>'+listsss.vip+'</b></li>'
                    }
                    html4+='</ul>';
                    $(".sumlists" ).append(html4);
                }else{
                    $(".sumlists" ).append('<div class="default"><img src="__HOME__/images/common/nomessage.png" alt="暂无消息"></div>');
                }
            }
        })
        mui('#popover2').popover("hide");
    });
</script>
{/block}